feat: Guided Tours Framework (Subgraphs)#2365
Open
camielvs wants to merge 1 commit into
Open
Conversation
🎩 PreviewA preview build has been created at: |
3 tasks
Collaborator
Author
This was referenced Jun 3, 2026
49656f5 to
a182d2f
Compare
57b8cdd to
afb2772
Compare
a182d2f to
5adf525
Compare
113a417 to
78cc132
Compare
5adf525 to
514c488
Compare
78cc132 to
7767801
Compare
514c488 to
05098d2
Compare
7767801 to
ee03e31
Compare
05098d2 to
b571f54
Compare
ee03e31 to
8dd2a4e
Compare
b571f54 to
0124745
Compare
8dd2a4e to
d60f1d2
Compare
0124745 to
75ab404
Compare
d60f1d2 to
721f5de
Compare
677a1a3 to
601b598
Compare
4ee52d2 to
65b41d0
Compare
0bf07b8 to
ccceaaf
Compare
108348f to
f153d01
Compare
ccceaaf to
d97d028
Compare
camielvs
commented
Jun 15, 2026
camielvs
commented
Jun 15, 2026
4ba9aae to
57d0195
Compare
59dc796 to
9fd6379
Compare
57d0195 to
b0e3d29
Compare
9fd6379 to
21b7cea
Compare
c89dd76 to
c0ef8e5
Compare
5386b19 to
785f1dd
Compare
c0ef8e5 to
0f7facd
Compare
785f1dd to
f12f3af
Compare
0f7facd to
2045cbf
Compare
f12f3af to
354c787
Compare
2045cbf to
3f6cba6
Compare
354c787 to
a87f286
Compare
3f6cba6 to
90ca438
Compare
a87f286 to
e2e270d
Compare
490aab5 to
a823d2b
Compare
024fa81 to
5b3c86f
Compare
a823d2b to
084077f
Compare
5b3c86f to
53954e7
Compare
084077f to
24c1b06
Compare
24c1b06 to
b29b14d
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.

Description
The subgraph-specific interaction mechanics for the guided-tour framework, layered on the framework stack (#2348 / #2299 / #2347 / #2340). Foundation for the Subgraphs tour (#2366) — this PR adds the interaction types and the bridge logic that detects them; the tour content lands in #2366.
Five new tour interactions cover navigating and authoring subgraphs, plus a canvas re-measurement fix so spotlights track the viewport when navigation changes the view.
What changed
Interaction vocabulary (
src/components/Learn/tours/registry.ts)Five new
TourStep.interactionvalues, plus atargetMinCountfield:navigate-into-subgraph— descends a level (optionally gated to a specifictargetTaskName)navigate-to-root— returns to the top levelunpack-subgraph— the active spec's subgraph-task count drops (a subgraph was flattened)multi-select-tasks— ≥targetMinCount(default 2) task nodes are selectedcreate-subgraph— the subgraph-task count rises (a subgraph was created)Bridge handlers (
src/routes/v2/pages/Editor/components/EditorTourBridge.tsx)Each interaction is detected by observing the existing MobX stores —
navigation.navigationDepth/navigationPathfor level changes,navigation.activeSpec.tasks(countingsubgraphSpec) for unpack/create, andeditor.multiSelectionfor multi-select. Following the model from #2299, a detected interaction marks the step complete in the shared tour-progress state (it does not advance the tour itself); already-satisfied-on-entry states are marked complete immediately. Gated "Next" / auto-advance (#2340) handle progression.Contextual checklist labels
Adds the checklist copy for these interactions (using the contextual bold-target support from #2340):
navigate-into-subgraph→ "Open the {targetTaskName} subgraph"multi-select-tasks→ "Select {targetMinCount} tasks"navigate-to-root→ "Return to the top level"unpack-subgraph→ "Unpack the subgraph"create-subgraph→ "Create a subgraph from the selected tasks"Spotlight re-measurement while navigating
resizeevent (viarequestAnimationFrame) whenever the xyflow viewport pans/zooms during an open tour, so reactour re-positions the highlight/popover after navigating into a subgraph shifts the canvas.ensureWindowRestorednow waits for the target DOM to actually appear — the step's ownselector, else the dock window — polling up to 1.5s before forcing a re-measure, instead of measuring against a not-yet-rendered target.Related Issue and Pull requests
Progresses https://github.com/Shopify/oasis-frontend/issues/583
Builds on the framework stack (#2348 / #2299 / #2347 / #2340); consumed by the Subgraphs tour in #2366.
Type of Change
Checklist
Test Instructions
The registry is otherwise inert in this PR — the interactions are exercised end-to-end by the Subgraphs tour in #2366. To verify in isolation:
ensureWindowRestoredsteps, and the dock/window highlight steps still work.Additional Comments
Selector/anchor additions and the seed pipeline for the subgraph tour live in #2366, following the convention that tour-specific DOM anchors ship alongside the tour that needs them.